<template>
  <div class="WeChat-Account">
    <el-tabs v-model="activeTabValue">
      <el-tab-pane label="Dashboard" name="10"></el-tab-pane>
      <el-tab-pane label="预约报修" name="1"></el-tab-pane>
      <el-tab-pane label="在线咨询" name="2"></el-tab-pane>
      <el-tab-pane label="联想超级课" name="5" refs="LenovoSuperClass" @click="resetRadioValue"></el-tab-pane>
      <el-tab-pane label="保修/配置/驱动" name="3"></el-tab-pane>
      <el-tab-pane label="官方翻新机查询" name="4"></el-tab-pane>
      <el-tab-pane label="个人中心" name="6"></el-tab-pane>
      <el-tab-pane label="我的购机需求" name="7"></el-tab-pane>
      <el-tab-pane label="渠道分析" name="8"></el-tab-pane>
      <el-tab-pane label="用户分析" name="9"></el-tab-pane>
    </el-tabs>
    <component :is="currentTabComponent"></component>
  </div>
</template>

<script>
  import AppointmentRepair from './components/AppointmentRepair/AppointmentRepair'
  import ChannelAnalysis from './components/ChannelAnalysis/ChannelAnalysis'
  import LenovoSuperClass from './components/LenovoSuperClass/LenovoSuperClass'
  import MyNeedForMachine from './components/MyNeedForMachine/MyNeedForMachine'
  import OnlineConsultation from './components/OnlineConsultation/OnlineConsultation'
  import PersonalCenter from './components/PersonalCenter/PersonalCenter'
  import RefurbishmentMachine from './components/RefurbishmentMachine/RefurbishmentMachine'
  import UserAnalysis from './components/UserAnalysis/UserAnalysis'
  import WarrantyDriver from './components/WarrantyDriver/WarrantyDriver'
  import Dashboard from './components/DBEnterWeChat'

  export default {
    name: "WeChatAccount",
    data() {
      return {
        // currentTabComponent: 'page1',
        activeTabValue: '10',
      }
    },
    components: {
      page1: AppointmentRepair,
      page2: OnlineConsultation,
      page3: WarrantyDriver,
      page4: RefurbishmentMachine,
      page5: LenovoSuperClass,
      page6: PersonalCenter,
      page7: MyNeedForMachine,
      page8: ChannelAnalysis,
      page9: UserAnalysis,
      page10: Dashboard,
    },
    methods: {
      resetRadioValue() {
        this.$refs.LenovoSuperClass.resetRadioValue()
      }
    },
    computed: {
      currentTabComponent: function () {
        return 'page' + this.activeTabValue
      }
    }
  }
</script>

<style lang="scss" scoped>
  .enterprise-wechat {
    background-color: #fff;
  }
</style>
<style lang="scss">
  .WeChat-Account {
    margin: 16px 20px;
    .el-tabs {
      box-shadow: 0 2px 10px 0 rgba(226, 224, 234, 0.6);
      border-radius: 6px;
      border: 1px solid #e6ebf5;
      .el-tabs__header {
        margin-bottom: 0;
        .el-tabs__item {
          height: 50px;
          line-height: 50px;
          font-family: MicrosoftYaHei;
          font-size: 16px;
        }
      }
    }
    .eCharts-wrap {
      display: flex;
      .echarts-part {
        flex: 1;
      }
    }
  }
</style>
